
<template>
	<div>
		<bread-crumb></bread-crumb>
		<div class="uc-body">
			<!--主要元素-->
			<uc-menu v-if="isLogin" ></uc-menu>
			<div v-else>请登录钱包</div>
		</div>

	</div>
</template>


<script type="text/javascript">
	import {mixins} from "@/mixins/mixins";
	import { mapState } from 'vuex'
	import breadCrumb from '../components/breadCrumb.vue'
	import ucMenu from "@/views/uc/components/ucMenu";
	import {judgeWhoAccessFunds} from "@/axios/api";

	export default {
		name:'ucIndex',
		components: { breadCrumb,ucMenu },
		mixins:[mixins],
		data () {
			return {
				baseValue : 1
			}
		},
		computed:{
			...mapState(['hideDabge']),
		},
		created () {

		},
		methods: {

		},

	};
</script>


<style lang="less">
	/*公共变量*/
	@import '~@/assets/global.less';
	/*用户中心功能菜单*/
	.uc-menu {
		ul {
			display:flex;align-items: center;justify-content: flex-start;flex-wrap: wrap;
			li{
				width: 25%;transition: all 0.5s;
				display:flex;align-items: center;justify-content: center;padding:0px 5px;
				margin-top: 7px;

				a{
					color:#666;
					height:180px;flex:1;font-size: 18px;transition: all 0.2s;cursor: pointer;border:1px solid #e5e5e5;
					border-radius:10px;display: flex;align-items: center;justify-content: center;flex-direction: column;
					background-color: #f9f9f9;
					.icon{color:#000;font-size: 48px;transition: all 0.2s;}
				}
				a:hover{border-color:#3f70ed;background-color: #fff;}
				a:hover .icon{color:#3f70ed}
				a:hover span{color:#3f70ed}
			}
		}
	}
	/**********************适应************************/
	@media screen and (max-width: @MINSCREEN){
		/*用户中心功能菜单*/
		.uc-menu {
			ul{
				li{width: 33%;}
				li .icon{font-size: 32px;}
				li a{
					height:30vw;font-size: 14px;
					.icon{font-size: 32px;}
				}
			}
		}

	}
</style>
